<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jQuery实现单击按钮隐藏段落</title>
    <script src="jquery-3.5.1/jquery-3.5.1/jquery-3.5.1.js"></script>
    <script>
        var isclose = false;
        $(function(){
            $("button").click(function(){
                // 定义单击按钮事件
                if(isclose==false)
                {
                    $("p").hide();//隐藏所有p标签
                    $("#text").hide();
                    $(".text").hide();
                    $("[href]").hide();
                    document.getElementById("bu").innerHTML="显示段落";
                    isclose=true;
                }
                else
                {
                    $("P").show();//再次点击显示
                    $("#text").show();
                    $(".text").show();
                    $("[href]").show();
                    document.getElementById("bu").innerHTML="隐藏段落";
                    isclose=false;
                }
                
            });
        });
    </script>
</head>
<body>
    <h1>标题一</h1>
    <p>元素选择器段落一</p>
    <p>段落二</p>
    <span id="text">id选择器</span>
    <br>
    <span class="text">类选择器</span>
    <br>
    <a href="https://fanyi.baidu.com/?aldtype=16047#auto/zh" target="blank">选取带有[href]属性的元素</a>
    <br>
    <button id="bu" style="border-radius: 3px;background-color: chartreuse;font-size: large;">隐藏段落</button>
</body>
</html>